;(function(){
    /* banner */
$('.banner1').banner({
    img: $(".banner1").children(".imgbox").find("a"),
    list: true,
    autoPlay: true,
    delayTime: 2000,
    moveTime: 300
});

$('.banner2').banner({
    img: $(".banner2").children(".images").find("a"),
    left: $(".banner2").find("#left"),
    right: $(".banner2").find("#right"),
    list: true,
    autoPlay: true,
    delayTime: 3000,
    moveTime: 300
});

/* 下拉菜单 */
class Menu {
    constructor(li, ele) {
        this.li = li;
        this.ele = ele;

        this.addEvent();
    }
    addEvent() {
        let that = this;
        this.ele.onmouseenter = function () {
            that.li.style.display = "block";
        }
        this.ele.onmouseleave = function () {
            that.li.style.display = "none";
        }

    }
}
new Menu(
    document.querySelector('.tools-left').children[2],
    document.querySelector('.tools-leftfont span')
);

/* 侧拉菜单 */
class Nav {
    constructor() {
        this.dd = document.querySelectorAll('.navCon .sl-all dd');
        this.li = document.querySelectorAll('.navCon .change li');
        this.list = document.querySelector('.shoplist');

        this.addEvent();
    }
    addEvent() {
        let that = this;
        for (let i = 0; i < this.dd.length; i++) {
            this.dd[i].onmouseover = function () {
                for (let j = 0; j < that.dd.length; j++) {
                    that.li[j].style.display = "none";
                }
                that.li[i].style.display = "block";
            }
            this.list.onmouseleave = function () {
                for (let i = 0; i < that.dd.length; i++) {
                    that.li[i].style.display = "none";
                }
            }
        }

    }
}
new Nav();

/* 请求数据,渲染页面 */
class Page {
    constructor(ops) {
        this.url = ops.url
        this.cont = ops.cont;
        this.num = ops.num;
        this.index = ops.index;
        this.left = ops.left;
        this.right = ops.right;

        this.load();
    }
    load() {
        ajaxGet(this.url, (res) => {
            this.res = JSON.parse(res);
            this.display();
            this.createPage();
        });
    }
    display() {
        let str = '';
        for (let i = this.index * this.num; i < (this.index + 1) * this.num; i++) {
            if (i < this.res.length) {
                str += ` <li>
                            <div class="tu">
                                <img src="${this.res[i].url}" height="140" width="140">
                            </div>
                            <h4 class="title text_ellipsis">${this.res[i].name}</h4>
                            <div class="priceCon">
                                <span class="price">￥${this.res[i].price}</span>
                                <span class="oldPrice">￥${this.res[i].refPrice}</span><br />
                                <span class="soldText">已售45%</span>
                                <a class="button">立即抢购</a>
                            </div>
                        </li>`
            }
        }
        this.cont.innerHTML = str;
    }
    createPage() {
        this.pageNum = Math.ceil(this.res.length / this.num);
        let that = this;
        this.left.onclick = function () {
            if (that.index === 0) {
                that.index = that.pageNum - 1;
            } else {
                that.index--;
            }
            that.display();
        }
        this.right.onclick = function () {
            if (that.index === that.pageNum - 1) {
                that.index = 0;
            } else {
                that.index++;
            }
            that.display();
        }
    }

}
new Page({
    url: "http://localhost/blShop-gulp/src/json/goods.json",
    cont: document.querySelector('.cright ul'),
    left: document.querySelector('.change_li #left1'),
    right: document.querySelector('.change_li #right1'),
    num: 6,
    index: 0
});


/* 登录守卫 */
class Gard {
    constructor() {
        this.indexLogin = document.querySelector('.indexLogin');
        this.welcome = document.querySelector('.welcome');
        this.wel = document.querySelector('.wel');
        this.cancle = document.querySelector('.cancel');
        this.setUser();
    }
    setUser() {
        this.userMsg = localStorage.getItem('userMsg') ? JSON.parse(localStorage.getItem('userMsg')) : [];
        let i = 0;
        let onoff = this.userMsg.some((val, idx) => {
            i = idx;
            return val.onoff === 1;
        });
        if (onoff) {
            this.indexLogin.style.display = 'none';
            this.welcome.style.display = 'block';
            this.wel.innerHTML = this.userMsg[i].user;
        } else {
            this.indexLogin.style.display = 'block';
            this.welcome.style.display = 'none';
        }
        this.addEvent(i);
    }
    addEvent(i) {
        let that=this;
        this.cancle.onclick = function () {
            that.userMsg[i].onoff = 0;
            localStorage.setItem("userMsg", JSON.stringify(that.userMsg));
            location.reload();
        }
    }
}
new Gard();

})();